import React from 'react';
import { InboxOutlined, UploadOutlined } from '@ant-design/icons';
// import type { UploadProps } from 'antd';
// import { Button, message, Upload } from 'antd';
import { Button, message } from 'antd';
import { Upload, UploadProps } from '.';

const props: UploadProps = {
  name: 'file',
  action: 'http://localhost:3333/upload',
  headers: {},
  // onChange(info) {
  //   if (info.file.status !== 'uploading') {
  //     console.log(info.file, info.fileList);
  //   }
  //   if (info.file.status === 'done') {
  //     message.success(`${info.file.name} file uploaded successfully`);
  //   } else if (info.file.status === 'error') {
  //     message.error(`${info.file.name} file upload failed.`);
  //   }
  // },
  beforeUpload(file) {
    if (file.name.includes('11')) {
      return false;
    }
    return true;
  },
  onSuccess(ret) {
    console.log('onSuccess', ret);
  },
  onError(err) {
    console.log('onError', err);
  },
  onProgress(percentage, file) {
    console.log('onProgress', percentage);
  },
  onChange(file) {
    console.log('onChange', file);
  },
  drag: true
};

const TestUpload: React.FC = () => (
  <Upload {...props}>
    <p>
      <InboxOutlined style={{ fontSize: '50px' }} />
    </p>
    <p>点击或者拖拽文件到此处</p>
  </Upload>
);

export default TestUpload;
